<template>
  <li style="width: 101%" class="cjy-translate aui-list-item "
      :class="{moveleft:showDele , 'cjy-regular-group-up':index != 0 && false,'cjy-regular-group-down':false && hasRegular}"
      @touchstart="" @touchend="">
    <tap-slider @sliderLeft="showDelButton" @sliderRight="heiddenDelButton">
      <div class="aui-media-list-item-inner cjy-outer-item">
        <div class="aui-media-list-item-inner line-normal-wrapper" style="padding-left:6rem">
          <div style="width: 1.5rem;height: 5.5rem;position: absolute;left: 0;">
            <span
              style="vertical-align: middle;line-height: 5.5rem;font-size: 0.6rem;color: #9a9a9a;margin-left: -0.8rem">失效</span>
          </div>

          <div class="aui-list-item-media"
               style="width:4.3125rem;height:4.3125rem ;position:absolute;left: 1.5rem;opacity: 0.5"
               @click.stop="goDetail()">
            <img v-lazy="detail.mainPic">
          </div>

          <div class="aui-list-item-inner suggest cjy-text-cart" @click.stop="goDetail()">
            <h3 style="height: 1.9rem; position: relative;color: #9a9a9a">
              {{goodsName}}
              <p style="bottom:0 ;position:absolute; height: 0.9rem; width: 100%;background: white;color: #9a9a9a"
                 v-if="processingattribute">
                加工服务：{{processingattribute}}
              </p>
            </h3>
            <p>规格：{{goodsType == weightType ? showUnit : goodsSpec}}

            </p>
            <p style="vertical-align: bottom">

            <span style="color: #444;font-size: 0.7rem">商品已售罄
          </span>&nbsp;
            </p>
            <p style="position: absolute;bottom:0.5rem; right: 1.5rem;font-size: 0.75rem"> X{{goodsNum}} </p>
            <div style="position: absolute;bottom:0;right:0;width:10rem;height:3rem; " @click.stop>
            </div>
          </div>
        </div>
        <div class="operations_list3" @click.stop="deleFromCart">
          <i class="icon njfont nj-shanchu"> </i>
          <p> 删除 </p>
        </div>
      </div>
    </tap-slider>

    <div v-if="isChecked" class="cjy-preferential"
         style="text-align: left ;background: white;vertical-align: bottom;line-height: 1rem">
      <div style="width: 100%;height: 0.8em;border-top: 1px dashed gainsboro"></div>
      <span
        class="cjy-sec-title">&nbsp;
    </span>
      <span
        style=" font-weight: 600;float:right;color:#444;font-size: 0.85rem;padding-right: 0.2rem">￥{{parseFloat(promTotalPrice + workingPrice).toFixed(2)}}</span>
      <span style="float:right;color: darkgrey">小计：</span>
    </div>
  </li>
</template>

<script>
  import UpdateCart from '@/components/UpdateCart'
  import {MessageBox} from '@/ui-components'
  import TapSlider from '@/components/TapSlider'
  import {translatePrice} from '@/utils/TranslatePriceC'


  export default {
    data() {
      return {
        isChecked: true,
        featureLabelList: null, // 类名查询表
        featureClass: '',//特色标签css类名
        goodsCode: "",  //产品分类
        enterpriseName: "宁家",  // 商家名称
        goodsId: "",   //产品ID
        goodsName: "", //产品名称
        goodsPrice: "", //产品价格
        goodsUnit: "", //产品单位
        city: "", //产地
        shopName: "", //商店名称
        saleqty: "", //库存
        goodsModel: "", // 商品型号
        goodsType: 0, //售价
        normalPrice: "", //原价
        mainPic: null, //主图缩略图
        featureLabel: "进口", //特色标签
        goodsSpec: '', //规格
        rid: '',
        goodsNum: '0',
        showWsPrice: 0,
        showNormalPrice: 0,
        showUnit: '',
        processingattribute: '',
        workingPrice: 0,
        weightType: 7,
        isStockCountOver: false,
        lastStockCountNum: 0,
        goodsStatus: 0

      }
    },
    created() {
      this.isChecked = this.isCheck
      this.initData()
    },
    components: {
      UpdateCart,
      TapSlider
    },
    props: {
      detail: {
        type: Object,
        default: () => {
          return {}
        }
      },
      showDele: {
        type: Boolean,
        default: false
      }
      ,
      isCheck: {
        type: Boolean,
        default: false
      }
      ,
      index: 0,
      hasRegular: {
        type: Boolean,
        default: true
      },
      prodVoList: {
        type: Array,
        default: () => []
      },
      prodVo: {
        type: Object,
        default: () => null
      },
      workingInfo: {
        type: String,
        default: ''
      },
    }
    ,
    watch: {
      isCheck(data) {
        this.isChecked = data
      }
      ,
      detail() {
        this.initData()
      }
    }
    ,
    computed: {
      promTotalPrice() {
        var num = this.goodsNum
        var price = this.goodsPrice
        var prodVo = this.prodVo
        if (this.prodVo) {
          return prodVo.promTotalPrice
        }
        var total = num * parseFloat(price)

        return total
      },

      showPrice() {
        var prodVoList = this.prodVoList
        var goodsCode = this.goodsCode
        var showPrice = this.goodsPrice
        var prodVo
        if (prodVoList.length > 0 && goodsCode) {
          prodVo = prodVoList.find((item) => {
              return item.goodsCode == goodsCode
            }
          )
        }
        if (prodVo) {
          // var spricePriceData = prodVo.promotionalVoList && prodVo.promotionalVoList.find((item) => {
          //     return item.saleType === 'specialOffer' && item.beUsed !== 1
          //   })
          if (prodVo.promSpecPrice || prodVo.killPrice) {
            showPrice = prodVo.killPrice || prodVo.promSpecPrice
            this.normalPrice = prodVo.price
          }
        }
        return parseFloat(showPrice).toFixed(2)
      },
    }
    ,
    methods: {
      deleFromCart() {
        MessageBox.confirm('删除商品', {title: "删除商品", message: "是否从购物车中移除该商品", cancelButtonText: '再看看'}).then(
          (res) => {
            this.$refs.updataCart.deleFromCart()
          }
        )

        this.$emit('heiddenDelButton', this.index)
      }
      ,
      goDetail(item) {
        if (this.goodsStatus == 3) {
          return
        }
        this.$router.push({path: 'detail', query: {code: this.goodsCode}})
      }
      ,
      allClick() {
        this.$refs.updataCart.updataCart()
      }
      ,
      showDelButton() {
        this.$emit('showDelButton', this.index)
      }
      ,
      heiddenDelButton() {
        this.$emit('heiddenDelButton', this.index)
      },
      initData() {
        var detail = this.detail
        var workingInfo = this.workingInfo ? JSON.parse(this.workingInfo) : ''
        var workingPrice = workingInfo ? workingInfo.procemoney : 0
        this.showUnit = detail.showUnit
        this.showWsPrice = detail.showWsPrice
        this.showNormalPrice = detail.showNormalPrice
        this.goodsCode = detail.goodsCode//产品分类
        this.goodsNum = detail.goodsNum || 0
        this.enterpriseName = detail.enterpriseName// 商家名称
        this.goodsId = parseInt(detail.goodsId) //产品ID
        this.goodsName = detail.goodsName//产品名称
        this.goodsPrice = detail.goodsPrice || 0//产品价格
        this.goodsUnit = detail.goodsUnit//产品单位
        this.city = detail.city//产地
        this.shopName = detail.shopName//商店名称
        this.saleqty = detail.saleqty//库存
        this.goodsModel = detail.goodsModel// 商品型号
        this.goodsType = detail.goodsType//售价
        this.normalPrice = detail.normalPrice//原价
        this.mainPic = detail.mainPic  //主图缩略图
        this.featureLabel = detail.featureLabel//特色标签
        this.weightType = detail.weightType
        this.goodsStatus = detail.goodsStatus
        this.lastStockCountNum = detail.lastStockCountNum
        this.isStockCountOver = detail.isStockCountOver
        this.goodsSpec = detail.goodsSpec // 规格
        this.processingattribute = workingInfo ? workingInfo.processingattribute : ''
        if (this.goodsType == 7 || this.goodsType == 6) {
          this.workingPrice = workingPrice
        } else {
          this.workingPrice = workingPrice * this.goodsNum
        }
      },

      translatePrice(showPrice) {
        var goodsUnit = this.goodsUnit.toLowerCase()
        var goodsType = this.goodsType
        if (goodsType == 7) {
          showPrice = 0.5 * showPrice
        }
//        if (goodsUnit == 'kg') {
//          showPrice = 0.5 * showPrice
//        } else if (goodsUnit == 'g') {
//          showPrice = 0.002 * showPrice
//        }
        showPrice = this.translatePriceNo(showPrice)
        return showPrice

      },
      translatePriceNo: translatePrice
    },

  }
</script>

<style scoped="">
  .cjy-outer-item {
    width: 100%;
    height: 5.5rem;
  }

  .line-normal-wrapper {
    width: 100%;
    position: relative;
  }

  .cjy-text-cart {
    position: relative !important;
    width: 100%;
    height: 100%;
    right: 0;
    text-align: left;
  }

  .operations_list3 {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    transform: translatex(100%)
  }

  .moveleft {
    transform: translatex(-3.5rem);
  }

  .cjy-translate {
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
  }

  .cjy-regular-group-up::before {
    content: '';
    position: absolute;
    height: 2.1rem;
    top: 0;
    left: 1.2rem;
    width: 0;
    border-left: thin dashed gold;
  }

  .cjy-regular-group-down::after {
    content: '';
    position: absolute;
    height: 2.1rem;
    bottom: 0;
    left: 1.2rem;
    width: 0;
    border-left: thin dashed gold;
  }

  .cjy-preferential {
    width: 100%;
    padding-right: 1rem;
    padding-bottom: 0.2rem;
  }
</style>

<style>
</style>
